import { createRouter, createWebHistory } from 'vue-router'

import { ElMessage } from "element-plus"


import routes from "./routes"
import store from "@/store/index"

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: routes,
})

/* 
  全局前置守卫  => 页面中所有的导航跳转都可以进行控制 

  router.beforeEach(function(to,from,next){ // 路由中间件函数 => 每次路由跳转,都会依次进过每一个路由中间件函数
        to  路由信息(对象) => 即将跳转的页面的路由信息
        from  当前路由信息 => 跳转前的页面的路由信息

        //  老版本
        next()  1. 允许进入下一个路由中间件函数(如果后续还存在路由中间件函数)   2. 运行访问页面(后面没有路由中间件函数)
        next(false)  不允许访问页面 (页面不会跳转)
        next("/login")  重定向
        next({path,name,query,paramse})   重定向

        // 新版本
        next()   =>   return true;  
        next(false)   => return false

        next("/login")    =>   return "/login"
        next({path,name,query,paramse})    return {path,name,query,paramse};
        
  })



*/

router.beforeEach(function (to, from) { // 路由中间件函数 => 每次路由跳转,都会依次进过每一个路由中间件函数
  console.log("路由中间件函数1:from", from);
  console.log("路由中间件函数1:to", to);

  // 先登录(存储数据到vuex),在跳转主页  可以访问 => store.getters.isLogin

  // console.log("store123123",store.getters.isLogin);  // 刷新会有问题  => 刷新时先走全局路由守卫,之后进入主页面 (我们在主页面挂载前,进行本地数据同步vuex )   =>  问题: 刷新页面,全局路由守卫中无法store.getters.isLogin => 有解决
  if (to.meta?.requireAuth) {
    // if(store.getters.isLogin){ // 已经登录 => 就跳转
    //   return true;
    // }else{ // 没有登录 => 去登录,登录成功,在回去
    //   next({path:"/login",query:{ReturnUrl:to.fullPath}})
    // }

    // 是否有权限访问页面  => 有就跳转, 没有就拒绝
    console.log("角色信息",store.getters.role);
    if(to.meta.role.includes(store.getters.role)){
      return true;
    }else{

      ElMessage({
        type:"error",
        message:"你在想屁吃!",
      })
      return false;
    }
  } else {
    return true;
  }
})

router.beforeEach(function (to, from) { // 路由中间件函数 => 每次路由跳转,都会依次进过每一个路由中间件函数
  console.log("路由中间件函数2");
  // next();
  return true;
})




export default router
